$(function () {
  // 公共的请求信息，方便筛选
  let comParams = {
    pagenum: 1, // 	是 	int 	页码值
    pagesize: 20, // 	是 	int 	每页显示多少条数据
    cate_id: "", // 	否 	string 	文章分类的 Id
    state: "", //否 	string 	文章的状态，可选值有：已发布、草稿
  }

  // 1.初始化文章类别分类
  initArticleCate()
  function initArticleCate() {
    axios({
      method: "get",
      url: "/my/article/cates",
    }).then(({ data: res }) => {
      // 失败提示
      if (res.status != 0) {
        return layer.msg(res.message)
      }
      // 渲染
      let arr = ['<option value="">请选择分类</option>']
      res.data.forEach((ele) => {
        arr.push(`
          <option value="${ele.Id}">${ele.name}</option>
        `)
      })
      $('[name="cate_id"]').empty().html(arr.join(""))
      layui.form.render()
    })
  }

  // 2.获取文章内容
  initArtList()
  function initArtList() {
    axios({
      method: "get",
      url: "/my/article/list",
      params: comParams,
    }).then(({ data: res }) => {
      // 失败提示
      if (res.status != 0) {
        return layer.msg(res.message)
      }
      // 渲染
      let arr = []
      res.data.forEach((ele) => {
        arr.push(`
          <tr>
            <td>${ele.title}</td>
            <td>${ele.cate_name}</td>
            <td>${dateFormat(ele.pub_date)}</td>
            <td>${ele.state}</td>
            <td>
              <!-- <button type="button" class="layui-btn     layui-btn-xs btn-edit">编辑</button> -->
              <button
                class="layui-btn layui-btn-danger     layui-btn-xs btn-delete"
                type="button"
                data_id="${ele.Id}"
              >删除</button>
            </td>
          </tr>
        `)
      })
      $("tbody").empty().html(arr.join(""))
      renderPage(res.total)
    })
  }

  // 3.筛选
  $("#choose").on("click", function (e) {
    e.preventDefault()
    // 修改公共的params
    comParams.cate_id = $('[name="cate_id"]').val()
    comParams.state = $('[name="state"]').val()
    initArtList()
  })

  // 4.删除
  $("tbody").on("click", ".btn-delete", function () {
    let id = $(this).attr("data_id")
    layer.confirm("是否要删除？", { icon: 3, title: "提示" }, function (index) {
      //do something
      axios({
        method: "get",
        url: "/my/article/delete/" + id,
      }).then(({ data: res }) => {
        // 失败提示
        if (res.status != 0) {
          return layer.msg("删除失败！")
        }
        // console.log($("tbody").length)
        let num = $("tbody").children().length
        num == 1 && comParams.pagenum != 1
          ? comParams.pagenum--
          : comParams.pagenum
        // 成功提示
        layer.msg("删除成功！")
        initArtList()
      })
      layer.close(index)
    })
  })

  // 5.分页
  //执行一个laypage实例
  function renderPage(total) {
    layui.laypage.render({
      elem: "page", //注意，这里的 test1 是 ID，不用加 # 号
      count: total, //数据总数，从服务端得到
      limit: comParams.pagesize, //每页显示的条数。laypage将会借助 count 和 limit 计算出分页数
      limits: [2, 5, 10, 15, 20], //每页条数的选择项
      curr: comParams.pagenum, //起始页，用作翻页
      layout: ["count", "prev", "page", "next", "limit", "refresh", "skip"],
      jump: function (obj, first) {
        //obj包含了当前分页的所有参数，比如：
        // console.log(obj.curr) //得到当前页，以便向服务端请求对应页的数据。
        // console.log(obj.limit) //得到每页显示的条数

        //首次不执行
        if (!first) {
          //do something
          comParams.pagesize = obj.limit
          comParams.pagenum = obj.curr
          initArtList()
        }
      },
    })
  }

  //dateFormat(ele.pub_date)
  // 封装一个格式化日期方法
  function dateFormat(str) {
    let dt = new Date(str)
    let y = dt.getFullYear()
    let m = padZero(dt.getMonth() + 1)
    let d = padZero(dt.getDate())

    let HH = padZero(dt.getHours())
    let MM = padZero(dt.getMinutes())
    let SS = padZero(dt.getSeconds())

    return `${y}-${m}-${d} ${HH}:${MM}:${SS}`
  }

  // 补零函数
  function padZero(n) {
    return n < 10 ? "0" + n : n
  }
})
